flo-bit.dev
[READ-ONLY] Mirror of https://github.com/flo-bit/dogumentation. Simple, minimalistic documentation template using astro
flo-bit.dev/dogumentation/
2.0 kB
69 lines
1import { OGImageRoute } from "astro-og-canvas";
2import config from "../../config";
3import { getSortedDocs } from "src/utils";
4
5const posts = await getSortedDocs();
6
7// turn posts into an object with slugs as keys, and title and description as values
8// { slug: { title, description } }
9
10const pages = posts.reduce(
11 (acc, post) => {
12 acc[post.id] = {
13 title: post.data.noTextInOGImage ? "" : post.data.title,
14 description: post.data.noTextInOGImage
15 ? ""
16 : (post.data.shortDescription ?? post.data.description ?? ""),
17 customOGImage: post.data.customOGImage,
18 };
19 return acc;
20 },
21 {} as Record<
22 string,
23 { title: string; description: string; customOGImage?: string }
24 >,
25);
26
27export const { getStaticPaths, GET } = OGImageRoute({
28 // Tell us the name of your dynamic route segment.
29 // In this case it’s `route`, because the file is named `[...route].ts`.
30 param: "route",
31
32 // A collection of pages to generate images for.
33 // The keys of this object are used to generate the path for that image.
34 // In this example, we generate one image at `/open-graph/example.png`.
35 pages: {
36 main: {
37 title: config.SITE_NAME,
38 description: config.SITE_DESCRIPTION,
39 },
40 ...pages,
41 },
42
43 // For each page, this callback will be used to customize the OpenGraph image.
44 getImageOptions: (_, page) => ({
45 title: page.title,
46 description: page.description,
47 bgImage: {
48 path: page.customOGImage
49 ? "." + page.customOGImage
50 : "./src/assets/backgrounds/background.jpg",
51 fit: "cover",
52 },
53 font: {
54 /** Font style for the page title. */
55 title: {
56 families: ["Inter"],
57 color: [255, 255, 255],
58 size: 80,
59 weight: "SemiBold",
60 },
61 description: {
62 families: ["Inter"],
63 color: [255, 255, 255],
64 },
65 },
66 padding: 80,
67 fonts: ["./src/assets/fonts/InterVariable.ttf"],
68 }),
69});